<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
  <input type="text" v-model="n1">
  <input type="text" v-model="n2">
  <input type="button" value="加" @click="f('+')">
  <input type="button"value="减"  @click="f('-')">
  <input type="button"value="乘"  @click="f('*')">
  <input type="button"value="除"  @click="f('/')">
   <h1 v-html="result">结果:{{result}}</h1>

</div>
<script src="../js/vue.js"></script>
<script>
    let v = new Vue({
      el:"div",
      data:{
        n1:"",n2:"",result:""
      },
      methods:{
        f(x){
          /*eval()方法可以将字符串以代码的形式执行*/
          v.result =  eval(v.n1+x+v.n2);
        }
      }

    })
</script>
</body>
</html>